<template>
  <div>
    <el-table
      :key="type"
      v-loading="listLoading"
      :data="list"
      fit
      stripe
      highlight-current-row
      style="width: 100%;"
    >
      <el-table-column
        label="序号"
        align="center"
        type="index"
        width="50"
      />
      <!-- <el-table-column label="入职时间" width="150px" align="center">
        <template slot-scope="{row}">
          {{ row.time|parseTime }}
        </template>
      </el-table-column> -->
      <el-table-column label="应聘者" width="120px" align="center">
        <template slot-scope="{row}">
          <span class="link-type" @click="viewInfo(row)">{{ row.userInfo.name }}</span>
        </template>
      </el-table-column>
      <el-table-column label="电话" width="120px" align="center" prop="userInfo.phone" />
      <el-table-column label="职位" width="250px" align="center" prop="jobInfo.jobName" />
      <el-table-column label="企业" width="250px" align="center" prop="enInfo.enName" />
      <el-table-column label="联系人" width="120px" align="center" prop="contacts.userName" />
      <el-table-column label="状态" width="120px" class-name="status-col" align="center">
        <template slot-scope="{row}">
          <span>{{ !row.state?"待入职":"待发入职通知" }}</span>
        </template>
      </el-table-column>
      <el-table-column label="操作" fixed="right" width="150" align="center">
        <template slot-scope="{row}">
          <el-button v-if="row.state" type="text" @click="enploy(row)">
            录用
          </el-button>
          <el-button v-else type="text" @click="modifyInfo(row.delId,6)">
            已入职
          </el-button>
          <el-button v-if="!row.state" type="text" @click="modifyInfo(row.delId,8)">
            未入职
          </el-button>
        <!-- <el-button v-if="row.status!='published'" size="mini" type="success" @click="handleModifyStatus(row,'published')">
          Publish
        </el-button>
        <el-button v-if="row.status!='draft'" size="mini" @click="handleModifyStatus(row,'draft')">
          Draft
        </el-button> -->
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      next-text="下一页"
      layout="prev, pager, next, jumper"
      :page.sync="listQuery.pageNo"
      :limit.sync="listQuery.pageSize"
      @pagination="getList"
    />

    <pdf-dialog ref="pdfDialog" @transportShow="transportShow" @employShow="employShow" @markRes="markRes" @interviewShow="interviewShow" @refresh="refresh" />
    <forward-drawer ref="transportDrawer" @refresh="refresh" />
    <interview-results-drawer ref="resDrawer" @refresh="refresh" />
    <interview-drawer ref="interviewDrawer" @refresh="refresh" />
    <employ-drawer ref="employDrawer" @refresh="refresh" />
  </div>
</template>

<script>
import { employmentList, employmentList2 } from '@/api/index'
import { editInfoById } from '@/api/personnel'
import Pagination from '@/components/Pagination' // secondary package based on el-pagination
import PdfDialog from '@/components/PdfDialog'
import forwardDrawer from '@/components/CurriculumVitaeStateDrawer/forwardDrawer.vue'
import interviewResultsDrawer from '@/components/CurriculumVitaeStateDrawer/interviewResultsDrawer.vue'
import interviewDrawer from '@/components/CurriculumVitaeStateDrawer/interviewDrawer.vue'
import employDrawer from '@/components/CurriculumVitaeStateDrawer/employDrawer.vue'
import { parseTime } from '@/utils/index'

export default {
  components: { Pagination, PdfDialog, forwardDrawer, interviewResultsDrawer, interviewDrawer, employDrawer },
  filters: {
    statusFilter(status) {
      const statusMap = {
        published: 'success',
        draft: '',
        deleted: 'danger'
      }
      return statusMap[status]
    },
    parseTime(e) {
      return parseTime(e, '{y}-{m}-{d}')
    }
  },
  props: {
    type: {
      type: String,
      default: ''
    },
    form: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      listLoading: true,
      list: null,
      total: 0,
      listQuery: {
        pageNo: 1,
        pageSize: 10,
        sort: false,
        jobName: '',
        enName: '',
        nameOrPhone: '',
        dayFlag: ''
      }
    }
  },
  watch: {
    form: {
      deep: true, // 深度监听
      immediate: true,
      handler(e) {
        Object.keys(e).forEach(item => {
          this.listQuery[item] = e[item]
        })
        this.getList()
      }
    }
  },
  mounted() {
    // this.getList()
  },
  methods: {
    // 查看信息
    viewInfo(row) {
      if (row.userInfo.delFlag) {
        this.$message.error('此人已被删除！')
        return false
      }
      row.dataId = row.delId;
      this.$refs.pdfDialog.show(row, false, true) // 第二个参数 查看投递记录tab 第三个参数 显示时间轴
    },
    // 发送简历
    transportShow(e) {
      console.log(e)
      this.$refs.transportDrawer.show(e.name, e.jobName, e.reId)
    },
    // 再次面试
    interviewShow(e) {
      this.$refs.interviewDrawer.show(e.name, e.id, e.jobName, e.jobId, e.companyId, e.reId, e.dataId, true) // 最后一个参数 不修改状态
    },
    // 反馈面试结果
    markRes(e) {
      this.$refs.resDrawer.show(e.id, e.userId)
    },
    // 录用
    employShow(e) {
      this.$refs.employDrawer.show(e.name, e.userId, e.jobId, e.componyId, e.id)
    },
    // 录用
    enploy(row) {
      this.$refs.employDrawer.show(row.userInfo.name, row.userInfo.userId, row.jobInfo.id, row.enInfo.id, row.delId, row.jobInfo.jobName)
    },
    // 标记入职
    modifyInfo(id, type) {
      this.$confirm('确定修改状态吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        editInfoById({ dataId: id, state: type }).then(response => {
          this.$message.success('修改成功！')
          this.getList()
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        })
      })
    },
    refresh() {
      this.getList()
      if (this.$refs.pdfDialog.dialogVisible && this.$refs.pdfDialog.showHis) {
        this.$refs.pdfDialog.getList()
      }
    },
    // 分页数据
    getList() {
      console.log(this.type)
      this.listLoading = true
      if (this.type == 1) {
        employmentList(this.listQuery).then(response => {
          this.list = response.result.records
          this.total = response.result.total
          this.listLoading = false
        })
      } else {
        employmentList2(this.listQuery).then(response => {
          this.list = response.result.records
          this.total = response.result.total
          this.listLoading = false
        })
      }
    }
  }
}
</script>
